import VideoBlot from './VideoBlot.js';

// 注册自定义视频Blot
Quill.register('blots/video', VideoBlot);

// 初始化Quill编辑器
const quill = new Quill('#editor', {
    theme: 'snow',
    modules: {
        toolbar: [
            [{ 'header': [1, 2, 3, 4, 5, 6, false] }],
            ['bold', 'italic', 'underline', 'strike'],
            ['blockquote', 'code-block'],
            [{ 'list': 'ordered'}, { 'list': 'bullet' }],
            [{ 'script': 'sub'}, { 'script': 'super' }],
            [{ 'indent': '-1'}, { 'indent': '+1' }],
            [{ 'direction': 'rtl' }],
            [{ 'size': ['small', false, 'large', 'huge'] }],
            [{ 'color': [] }, { 'background': [] }],
            [{ 'font': [] }],
            [{ 'align': [] }],
            ['clean'],
            ['link', 'image'],
            ['video']
        ]
    },
    placeholder: '开始编辑内容...'
});

// 设置欢迎词样式为灰色
const welcomeText = quill.root.innerHTML;
quill.root.style.color = '#999';

// 添加点击事件，清空欢迎词
quill.root.addEventListener('click', function() {
    if (quill.root.innerHTML === welcomeText) {
        quill.root.style.color = 'inherit';
        quill.setText('');
    }
});

// 处理图片上传
const imageHandler = () => {
    const input = document.createElement('input');
    input.setAttribute('type', 'file');
    input.setAttribute('accept', 'image/*');
    input.click();

    input.onchange = () => {
        const file = input.files[0];
        if (file) {
            const reader = new FileReader();
            reader.onload = (e) => {
                const range = quill.getSelection(true);
                quill.insertEmbed(range.index, 'image', e.target.result);
            };
            reader.readAsDataURL(file);
        }
    };
};

// 处理视频上传
const videoHandler = () => {
    const input = document.createElement('input');
    input.setAttribute('type', 'file');
    input.setAttribute('accept', 'video/*');
    input.click();

    input.onchange = () => {
        const file = input.files[0];
        if (file) {
            const reader = new FileReader();
            reader.onload = (e) => {
                const range = quill.getSelection(true);
                const videoUrl = e.target.result;
                // 使用自定义VideoBlot插入视频
                quill.insertEmbed(range.index, 'video', videoUrl);
            };
            reader.readAsDataURL(file);
        }
    };
};

// 绑定工具栏按钮事件
const toolbar = quill.getModule('toolbar');
toolbar.addHandler('image', imageHandler);
toolbar.addHandler('video', videoHandler);

// 处理粘贴图片
quill.clipboard.addMatcher(Node.ELEMENT_NODE, (node, delta) => {
    if (node.tagName === 'IMG') {
        delta.ops = [
            { insert: { image: node.getAttribute('src') }}
        ];
    }
    return delta;
});

// 处理拖放上传
quill.root.addEventListener('drop', (e) => {
    e.preventDefault();
    const file = e.dataTransfer.files[0];
    if (file) {
        const reader = new FileReader();
        reader.onload = (e) => {
            const range = quill.getSelection(true);
            if (file.type.includes('image')) {
                quill.insertEmbed(range.index, 'image', e.target.result);
            } else if (file.type.includes('video')) {
                quill.insertEmbed(range.index, 'video', e.target.result);
            }
        };
        reader.readAsDataURL(file);
    }
});

quill.root.addEventListener('dragover', (e) => {
    e.preventDefault();
});